<template>
    <view class="touxiang">
        <text style="font-size: 30rpx;color: rgb(48,49,51);">头像</text>
        <button style="width: 80rpx;height: 80rpx;margin: 0;padding: 0;" 
        open-type="chooseAvatar" 
        @chooseavatar="chooseavatar">
        <image 
        style="width: 80rpx;height: 80rpx;position: relative;" 
        :src="avatar"
        @click="editImg()"
        >
        <view v-if="!businessImg" class="acquiesce">默认</view>
        </image>
    </button>
    </view>
    <view class="name">
        <text style="font-size: 30rpx;color: rgb(48,49,51);">用户名</text>
       <input type="nickname" v-model="weChatName" @change="onInput" style="font-size: 28rpx; color: rgb(144,147,153);text-align: right;">
    </view>
    <!-- <view class="edit" @click="gotoReset()">
        <text>修改密码</text>
        <image style="width: 48rpx;height: 48rpx;" src="https://www.diandianyouke.site:801/fileDataBase/static/stag/static/img/icon_jiantouy.png"/>
    </view>
    <view class="quit" @click="quit">退出登录</view> -->
    <button class="btn" @click="getpublish()">保存</button>
</template>

<script>
import { httpRequest } from '../../utils/http';
export default {
    name: 'UniPresetVueVite1UserInfo',

    data() {
        return {
            userName:uni.getStorageSync('business').businessName,
            img:'',
            businessImg:uni.getStorageSync('business').businessImg?1:0,
            avatar:uni.getStorageSync('business').businessImg?uni.getStorageSync('business').businessImg:'https://www.diandianyouke.site:801/fileDataBase/static/stag/static/img/user_icon_HeadSculpture.png',
            tempFilePaths:'',
            business:{},
            weChatName:''
        };
    },

    onLoad(args) {
        this.weChatName = uni.getStorageSync('business').weChatName
    },

    methods: {
        onInput(e){
            console.log(e.detail.value);
            this.weChatName = e.detail.value
        },
        gotoReset(){
            uni.navigateTo({ url: '/pageC/index/reset' })
        },
        quit(){
            uni.showModal({
                title: '提示',
                content: '确认退出吗?',
                showCancel: true,
                success: ({ confirm, cancel }) => {
                    if(confirm){
                        uni.clearStorageSync()
        	            uni.reLaunch({ url: '/pages/login/login' })
                    }
                }
            })
        	
        },
        async getpublish(){
            uni.showLoading()
            this.selectLogo(this.avatar)
            await httpRequest('/api/editWeChatName','POST',{
                weChatName:this.weChatName,
                businessId:uni.getStorageSync('business').businessId
            })
            uni.login({
			success: async(result) => {
				console.log(result);
				result.code
				const res = await httpRequest('/api/WeChatLogin','POST',{code:result.code})
				console.log(res);
				uni.setStorageSync('token',res.data.token)
				uni.setStorageSync('business',res.data.business)
			},
			fail: (error) => {
				console.log(error);
			}
		})
        setTimeout(() => {
            uni.hideLoading()
            uni.showToast({title:'修改成功',icon:'none'})
            uni.switchTab({ url: '/pages/mine/mine' })
        }, 2000);
            
        },
        chooseavatar(e) {
    console.log("avatarUrl",e.detail.avatarUrl)
    this.avatar = e.detail.avatarUrl
    
  },
        editImg(){
    //         wx.getUserProfile({
    //           desc: '用于完善用户资料', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
    //           success: (res) => {
    //             console.log(res.userInfo);
    //           }
    //         })
    //         uni.chooseImage({
  	// 				success: async (res) => {
	// 				console.log(res);
	// 	 			this.tempFilePaths = res.tempFiles[0]
	// 				this.selectLogo(res)
	// 				 this.avatar = res.tempFilePaths[0]
    //     }
    // })
        },
        selectLogo(res){
			console.log(1);
			console.log(res);
			// this.formData.shopImg = res.tempFiles[0]
			const path = res
			uni.getFileSystemManager().readFile({
        filePath: path,
        encoding: 'base64',
        success: async(data) => {
          // 图片已经转换为Base64编码，可以在data.data中访问
          console.log('Base64编码:', data.data);
			this.img = data.data
            //上传图片
            const res = await httpRequest('/api/businessImg','POST',{
                img:this.img,
                businessId:uni.getStorageSync('business').businessId
            })
            console.log(res);
            this.business = uni.getStorageSync('business')
            this.business.businessImg = res.data
            uni.setStorageSync('business',this.business)
            uni.showToast({title:'修改成功',icon:'success'})
        },
        fail: (error) => {
          console.error('读取文件失败', error);
        }
      });
		},
    },
};
</script>

<style lang="scss" scoped>
.touxiang{
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 140rpx;
    padding: 30rpx;
    background-color: #fff;
    font-size: 28rpx;
    .acquiesce{
			display: flex;
			justify-content: center;
			align-items: flex-end;
			position: absolute;
			bottom: 0;
			left: 0;
			width: 80rpx;
			height: 46rpx;
			font-size: 22rpx;
			color: #fff;
			background: linear-gradient(180deg,rgba(25,0,46,0) 0%,rgba(25,0,46,0.61) 100%);
			text-align: center;
		}
}
.name{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 32rpx;
    background-color: #fff;
    font-size: 28rpx;
}
.edit{
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 108rpx;
    padding: 30rpx;
    font-size: 30rpx;
    color: rgb(48,49,51);
    margin: 24rpx 0;
    background-color: #fff;
}
.quit{
    height: 108rpx;
    text-align: center;
    line-height: 108rpx;
    font-size: 32rpx;
    color: rgb(142,84,244);
    background-color: #fff;
}
.btn{
    position: fixed;
    bottom: 34rpx;
    left: 16rpx;
    width: 686rpx;
    height: 88rpx;
    background-color: rgb(142,84,244);
    color: #fff;
    font-size: 32rpx;
    text-align: center;
    line-height: 88rpx;
    border-radius: 8rpx;
}
</style>